<script type="text/javascript" language="javascript">
    
    function CreateXMLHttpRequest()
    {
        if ( window.XMLHttpRequest )
        {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            return new XMLHttpRequest()
        }
        else if (window.ActiveXObject )
        {
            // code for IE6, IE5
            return new ActiveXObject("Microsoft.XMLHTTP")
        }
    }
    
    
    function ClickPicture(id)
    {
        var xmlHttp;
        xmlHttp = CreateXMLHttpRequest();
        xmlHttp.onreadystatechange = function()
        {
            if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
            {
                var kq = xmlHttp.responseText;
			
                document.getElementById("choose_right_word").innerHTML = kq;
            }
        }
        
        var serverURL =  'ClickPicture?id='+id+'&t=' + (new Date()).getTime();
		
        xmlHttp.open("get", serverURL, true);
		
        xmlHttp.send(null);
    }
    
    
    function ClickNext()
    {
        var xmlHttp;
        xmlHttp = CreateXMLHttpRequest();
        xmlHttp.onreadystatechange = function()
        {
            if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
            {
                var kq = xmlHttp.responseText;
			
                document.getElementById("testContent").innerHTML = kq;
            }
        }
        
        var serverURL =  'ClickNext?t=' + (new Date()).getTime();
		
        xmlHttp.open("get", serverURL, true);
		
        xmlHttp.send(null);
    }
    
</script>


<?php

function fixObject(&$object) {
    if (!is_object($object) && gettype($object) == 'object')
        return ($object = unserialize(serialize($object)));
    return $object;
}

$ThreeWord = $_SESSION["ThreeWord"];

$rightWord = new Word();
$rightWord = $ThreeWord[0];
$virtualWord1 = $ThreeWord[1];
$virtualWord2 = $ThreeWord[2];
$tempThreeWords = array();

fixObject($rightWord);
fixObject($virtualWord1);
fixObject($virtualWord2);
?>


<div id="testContent">
    <div class = "topic_video"> <!-- khung ghi đề bài -->
        <div class="left_audio">
            <audio src="<?php echo elgg_get_site_url(); ?>mod/MyCourse/<?php echo $rightWord->audio; ?>"  controls/>  
        </div>

        <div class="right_audio"> <!-- Phần Câu Trả Lời -->
            <?php echo $rightWord->engName; ?></div>
    </div> <!-- End khung ghi đề bài -->


    <div id = "choose_right_word"> <!-- choose_right_word -->

        <table>
            <tr>
                <?php
                for ($i = 0; $i < 3; ++$i) {
                    $tempWord = new Word();
                    $order = array_rand($ThreeWord);
                    $tempWord = $ThreeWord[$order];
                    unset($ThreeWord[$order]);
                    array_push($tempThreeWords, $tempWord);
                    fixObject($tempWord);
                    ?>



                    <td style="width: 250px;"> 
                        <div   class="picture_box" ><a href="#" onclick='ClickPicture(<?php echo $tempWord->id; ?>);' ><img  id="new_word" src="<?php echo elgg_get_site_url(); ?>mod/MyCourse/<?php echo $tempWord->picture; ?>" alt="new world"/>
                            </a><p><?php echo $tempWord->vietName; ?></p>
                        </div>
                    </td>

                    <?php
                    $_SESSION["tempThreeWords"] = $tempThreeWords;
                }
                ?>
            </tr>
        </table>
    </div> <!-- End choose_right_word -->


    <a  href="#" onclick='ClickNext();' class="elgg-button elgg-button-submit" >Next</a>
</div>